<!DOCTYPE html>

<html >
    <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, minimal-ui=1">

    <title>海景别墅</title>

    <link rel="stylesheet" type="text/css" href="./src/css/main.css">

  </head>
  <body>
    <div class="instructions-container">
      <div class="instructions look" data-ref="look_instructions">
        <div class="inner">
          <div class="hand"></div>
          <div class="copy">请点击或者移动鼠标</div>
        </div>
      </div>

      <div class="instructions material" data-ref="material_instructions">
        <div class="inner">
          <div class="copy">你可以选择不同的材料</div>
        </div>
      </div>

      <div class="instructions move" data-ref="move_instructions">
        <div class="inner">
          <div class="tap"></div>
          <div class="copy">Tap on the floor to move around</div>
        </div>
      </div>
    </div>

    <div class="loading">
      <div class="background"></div>
      <div class="inner">
        <div class="border" data-ref="border"></div>
        <div class="panel-container" data-ref="panel_container">
          <div class="panel" data-ref="panel">

            <div class="main" data-ref="titlescreen_main">
              <div class="illustration" data-ref="titlescreen_illustration"></div>
              <div class="main-content">
                <h1 class="title">VR海景房</h1>
                
                <div class="progress" data-ref="progress" style="display: none;"><span class="text">加载中</span><span class="percentage">100</span>%</div>
                <div class="start" data-ref="start" style="display: block;">参观别墅</div>
              </div>
            </div>

            <div class="about">
              <h2 class="title">About</h2>
              <div class="copy">
                <p>
                   threejs.org
                </p>
            
              </div>
              <div class="close" data-ref="close_about"></div>
            </div>

            <footer data-ref="titlescreen_footer">
              <div class="sharing">
            
              </div>
              <div class="credits">
              
              </div>
            </footer>

          </div>
        </div>
      </div>
    </div>

    <div class="about-button" data-ref="about_button"></div>

    <canvas id="main_canvas" width="1920" height="921" style="width: 1920px; height: 921px;"></canvas>

  
    <script src="./src/js/jquery.min.js"></script>
    <script src="./src/js/three.min.js"></script>
    <script src="./src/js/main.min.js"></script>

  
</body></html>